<template>
  <div>
    <table-where :forms="forms"></table-where>
    <wms-table ref="tableQuery" :tableDatas="tableDatas" @confirmHandle="confirmHandle" @detailClick="detailClick"></wms-table>
  </div>

   <el-drawer v-model="edit" show-close :close-on-click-modal="false" size="70%">
    <edit-table ref="editTableRef" :editTbleDatas="editTbleDatas"></edit-table>
    <div class="editFormsButton">
      <table-where :forms="editForms"></table-where>
    </div>
    
  </el-drawer>

</template>

<script setup name="待拣货">
import { ref, reactive } from 'vue'
import { POSTJSON,GET } from '@/components/utils/http'
import { MessageBox,objAssign } from '@/components/utils/api'
import { useWmsGlobal } from '@/store/wmsGlobal'
const wmsGlobal = useWmsGlobal()
const edit = ref(false);
const currRow = reactive({});
const tableDatas = reactive({
  body: {
    //表数据
    head: 'outPicking',
    url: '/OutStore/getDeliverDetailPage',
    params: { out_store_stat: 1 },
    type: 'POSTJSON'
  },
  confirm: true
})
const editTbleDatas = reactive({
  head: [
    { name: '商品名称', value: 'name' },
    { name: '货位', value: 'sname' },
    { name: '长', value: 'len'},
    { name: '宽', value: 'width' },
    { name: '高', value: 'height' },
    { name: '货架号', value: 'store_racks' },
    { name: '库存余量', value: 'effec_qty' },
    { name: '拣货数量', value: 'qty', type: 'numberInput',rule: { required: false }  },
  ],
  hideButton:true,
  editData: [],
  getRow: () => {
    return {
      qty: 0
    }
  }
})
const tableQuery = ref()
const onSubmit = () => {
  tableQuery.value.getData()
}
const forms = reactive({
  data: tableDatas.body.params,
  compValue: [
    {
      placeholder: '供应商',
      value: 'params',
      id: 'c_id',
      type: 'iconinput',
      onclick: () => {
        wmsGlobal.getClient(forms.data.params).then(data => {
          forms.data.c_id = data.id
          forms.data.params = data.name
        })
      }
    },
    {
      placeholder: '商品信息',
      value: 'paramsG',
      id: 'g_id',
      type: 'iconinput',
      onclick: () => {
        wmsGlobal.getGoods(forms.data.paramsG).then(data => {
          forms.data.g_id = data.id
          forms.data.paramsG = data.name
        })
      }
    },
    { label: '查询', type: 'button', onclick: onSubmit },
  ]
})
const editForms = reactive({
  compValue: [
    {
      label: '保存',
      type: 'button',
      onclick: () => {
        const params = []
        editTbleDatas.editData.forEach(item =>{
          const obj ={
            store_detail_id:currRow.id,
            store_location_id:item.store_location_id,
            g_id:item.g_id,
            qty:item.qty
          }
          params.push(obj);
        })
        POSTJSON('/OutStore/addPicking', params).then(data => {
          if (data.code ===200) {
            edit.value = false;
            onSubmit()
          }
        })
      }
    },
    {label: '返回',type: 'button',onclick: () =>edit.value = false}
  ]
})
const detailClick = (row)=>{
  objAssign(currRow,row);
  edit.value = true;
  GET('/OutStore/getPicking', { g_id:row.g_id,store_detail_id:row.id }).then(data => {
    if (data.code === 200) {
      editTbleDatas.editData=data.data
    }
  })
}
const confirmHandle = ({ row }) => {
  MessageBox('【' + row.name + '】拣货完成吗', () => {
    POSTJSON('/OutStore/updateDeliverDetail', { out_store_stat: 4, id: row.id }).then(data => {
      if (data.code === 200) {
        onSubmit()
      }
    })
  })
}
</script>
